<!doctype html>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <title>云客运营中心首页</title>
    <!--#include virtual="inc/head.html"-->
    <style>
        html,body{height: 100%;}
        .tipMaskBg {
            position: fixed;
            height: 100%;
            width: 100%;
            background: rgb(0, 0, 0);
            background: rgba(0, 0, 0, 0.8);
            z-index: 100;
            display: none;
            top: 0;
            left: 0;
            text-align: center;
            cursor: pointer;
        }

        .tipLevel_1, .tipLevel_2, .tipLevel_3, .tipLevel_4, .tipLevel_5 {
            position: relative;
            top: 50%;
            left: 50%;
            margin-left: -232px;
            margin-top: -290px;
            font-size: 14px;
            width: 465px;
            height: 580px;
            display: none;
        }

        .tipLevel_1 p, .tipLevel_2 p {
            color: #fff;
            line-height: 25px;
        }

        .level2_btn {

        }

        .mt30 {
            margin-top: 30px;
        }

        .joyride-timer-indicator-wrap, .joyride-close-tip, .joyride-timer-indicator {
            display: none !important;
        }
        .joyride-content-wrapper{
            padding: 8px;
        }
        .tipTarget {
            position: absolute;
            z-index: 9999998;
            background-color: #FFF;
            border: 3px solid #777;
            border: 3px solid rgba(243, 95, 43, 1);
            border-radius: 4px;
            box-shadow: 0 2px 15px rgba(0, 0, 0, .4);
            height: 34px;
            padding: 0 5px;
            text-align: center;
            line-height: 28px;
        }
        .study_left.tipTarget{border-radius: 100px;width: 180px; height: 180px;}
        .product.tipTarget{height: 155px;width: 60%;border-radius: 25px !important;}
        .joyride-tip-guide p{margin:0 !important;}
        .tipText1{margin-left: -25px;}
        .tipText2{margin-left: -206px;}
        .tipText3{margin-left: -206px;}
        .tipText4{margin-left: -206px;}
        .tipText1 img{margin-left: 10px;}
        .tipText2 img{margin-left: -257px;margin-top: 20px !important;}
        .tipText3 img{margin-left: -320px;margin-top: 20px !important;}
        .tipText4 img{margin-left: -330px;margin-top: 200px !important;}
        .tipText5 img{margin-left: -330px;margin-top: 200px !important;}
        #recommendDiv .margin-box{cursor: initial;}
        h2{line-height: 23px;}
        .tipImg2{margin-left: -486px; margin-top: 70px;}
        .tipImg3{margin-left: -583px;margin-top: 60px;}
        .tipImg4{margin-left: -500px; margin-top: 10px;}
        .tip_close{position: absolute; top: 0px; right: 0px;}
        .tipLevel_2 .tip_close{margin-top: 15px;left: 20px;}
        .tipLevel_3 .tip_close{margin-top: 0px;left: -15px;}
        .tipLevel_4 .tip_close{margin-top: -5px;left: 30px;}
        .tipLevel_5 .tipText1{margin-left: 0px;}
    </style>
</head>
<!--#include virtual="inc/seajs.html"-->
<body>
<!--#include virtual="inc/tip.html"-->
<!--#include virtual="inc/top.html"-->
<!--#include virtual="inc/nav.html"-->
<section id="index" class="index">
    <div class="container">
        <div class="row">
            <div class="col-xs-8 col-md-8">
                <div class="row">
                    <div class="col-xs-12 col-md-12 pt0 animated" data-animation="fadeInLeft"
                         data-animation-delay="300">
                        <div class="margin-box">
                            <div class="fullSlide" id="bannerDiv">
                                <div class="hd"></div>
                                <!-- <span class="prev"></span> <span class="next"></span> -->
                            </div>
                        </div>
                    </div>
                </div>
                <div id="recommendDiv"></div>
                <div id="studyDiv"></div>
                <div id="productDiv"></div>
            </div>
            <div class="col-xs-4 col-md-4">
                <div class="index_right pl35">
                    <div class="active animated" data-animation="fadeInRight" id="noticeDiv"
                         data-animation-delay="300"></div>
                    <div class="cbg clearfix animated" id="downloadDiv" data-animation="fadeInRight"
                         data-animation-delay="600" style="width: 100%;"></div>
                    <div class="hly clearfix animated" id="collegeDiv" data-animation="fadeInRight"
                         data-animation-delay="900" style="width: 100%;"></div>                  
                </div>
            </div>
        </div>
    </div>
</section>
<!--#include virtual="inc/footer.html"-->
<script id="banner" type="text/html">
    <ul class="bd">
        {{each list as value i}}
        <li><a href="{{value.file_url}}" target="_blank"><img src="{{value.image_url}}"/></a></li>
        {{/each}}
    </ul>
    <div class="hd"></div>
</script>

<script id="notice" type="text/html">
    <h2 class="font_size16 title title_line text-left">
        <i class="title_icon active"></i><span id="TipMsg6" title="{{name}}">{{name | formatStringLen:10}}</span>
        <a href="list.html?dirId={{id}}" class="fr font_size14 c_green">更多></a>
    </h2>
    <ul>
        {{each list as value i}}
        <li><a href="details.html?category={{name | encodeURL}}&articalId={{value.a_id}}&pid={{id}}">{{value.title |
            formatStringLen:18}}</a></li>
        {{/each}}
    </ul>
</script>
<script id="college" type="text/html">
    <h2 class="font_size16 title title_line text-left">
        <i class="title_icon p_active"></i><span id="TipMsg4" title="{{name}}">{{name | formatStringLen:10}}</span>
        <a href="list.html?dirId={{id}}" class="fr font_size14 c_green">更多></a>
    </h2>
    <ul class="clear">
        {{each list as value i}}
        <li>
            {{if '0'==value.is_empty }}<a href="details.html?category={{name | encodeURL}}&articalId={{value.a_id}}&pid={{id}}">{{/if}}
            {{if '0'!=value.is_empty }}<a href="{{value.file_url}}">{{/if}}
                <span class="fl" title="{{value.title}}">{{value.title | formatStringLen:18}}</span>
            </a></li>
        {{/each}}
    </ul>
</script>

<script id="download" type="text/html">
    <h2 class="font_size16 title title_line text-left">
        <i class="title_icon wt"></i><span id="TipMsg5" title="{{name}}">{{name | formatStringLen:10}}</span><a
            href="list.html?dirId={{id}}"
            class="fr font_size14 c_green">更多></a>
    </h2>
    <ul class="clear">
        {{each list as value i}}
        <li>
            {{if '0'==value.is_empty }}<a href="details.html?category={{name | encodeURL}}&articalId={{value.a_id}}&pid={{id}}">{{/if}}
            {{if '0'!=value.is_empty }}<a href="{{value.file_url}}">{{/if}}
                <span class="fl" title="{{value.title}}">{{value.title | formatStringLen:18}}</span>
                {{ if value.file_url }}<span data-fileurl="{{value.file_url}}" class="download fr"></span>
                {{/if}}
            </a></li>
        {{/each}}
    </ul>
</script>

<script id="recommend" type="text/html">
    <h2 class="font_size16 pt35 title title_line text-left animated" data-animation="fadeInUp"
        data-animation-delay="100">
        <i class="title_icon hot"></i><span class="TipMsg1" title="{{name}}">{{name | formatStringLen}}</span><span
            class="c_orange font_size14 ml20">{{short_desc}}</span>
        <a href="list.html?dirId={{id}}" class="fr font_size14 c_green">更多></a>
    </h2>
    <div class="row hot font_size14 text-center">
        {{each children as value i}}
        <div class="col-md-3 col-xs-6 animated" data-animation="fadeInLeft" data-animation-delay="{{(i+1)*300}}">
            <div class="margin-box">
                <img src="{{value.img_url}}" alt="{{value.tag}}">

                <p class="p15"><a href="list.html?dirId={{value.id}}&pid={{id}}">{{value.name}}</a>
                </p>
            </div>
        </div>
        {{/each}}
    </div>
</script>

<script id="study" type="text/html">
    <h2 class="font_size16 pt35 title title_line text-left animated" data-animation="fadeInLeft"
        data-animation-delay="1300">
        <i class="title_icon study"></i><span class="TipMsg2" title="{{name}}">{{name | formatStringLen}}</span><span
            class="c_orange font_size14 ml20">{{short_desc}}</span>
        <a href="list.html?dirId={{id}}" class="fr font_size14 c_green">更多></a>
    </h2>

    {{each children as value i}}
    {{ if i%2==0 }}
    <div class="row hot font_size14 pl15">
        {{/if}}
        <div class="col-xs-12 col-md-6 animated" data-animation="{{i%2==0?'fadeInLeft':'fadeInRight'}}"
             data-animation-delay="{{['300','300','600','900'][i]}}">
            <div class="row">
                <div class="col-xs-4 text-center">
                    <div class="margin-box">
                        <div class="study_left fl TipMsg2">
                            <img src="{{value.img_url}}" alt="">

                            <p class="font_size16 pt10" style="color: #393939;">{{value.name}}</p>
                        </div>
                    </div>
                </div>
                <div class="col-xs-8">
                    <div class="margin-box">
                        <div class="study_right text-left" >
                            <ul>
                                {{each value['list'] as linkList j}}
                                <li>
                                    <a title={{linkList.title}} href="details.html?category={{name | encodeURL}}&sub={{value.name | encodeURL}}&articalId={{linkList.a_id}}">{{linkList.title | formatStringLen:20}}</a>
                                </li>
                                {{/each}}
                            </ul>
                        </div>
                        <a href="list.html?dirId={{value.id}}&pid={{id}}" class="font_size14 fr c_green mlr10">更多></a>
                    </div>
                </div>
            </div>
        </div>
        {{ if i%2==1 }}
    </div>
    {{ /if}}
    {{/each}}
    </div>
</script>


<script id="product" type="text/html">
    <h2 class="font_size16 title pt35 title_line text-left animated" data-animation="fadeInLeft"
        data-animation-delay="100">
        <i class="title_icon product"></i><span class="TipMsg3" title="{{name}}">{{name | formatStringLen}}</span><span
            class="c_orange font_size14 ml20">{{short_desc}}</span>
        <a href="{{list.html?dirId={{id}}" class="fr font_size14 c_green">更多></a>
    </h2>

    <div class="row product font_size14 text-center TipMsg3">
        {{each children as value i}}
        <div class="col-xs-6 col-md-3 animated" data-animation="fadeInLeft" data-animation-delay="{{1200/(i+1)}}">
            <div class="margin-box">
                <a href="{{list.html?dirId={{value.id}}&pid={{id}}"><img src="{{value.img_url}}" alt="">

                    <p class="product_name p15"><span>{{value.name}}</span></p></a>
            </div>
        </div>
        {{/each}}
    </div>
</script>
<div class="tipMaskBg" id="guideTip">
    <div class="tipLevel_1">
        <img src="images/tipImg.png" alt="" />
        <div class="tip_close"><img src="images/tipClose.png" alt="" /></div>
        <div class="tipText1 tip_btn" rel="1">
            <img class="mt30 level1_btn" src="images/view_now.png" alt=""/>
        </div>
    </div>
    <div class="tipLevel_2" style="display:none">
        <img src="images/tipImg2.png" alt=""  class="tipImg2" />
        <div class="tip_close"><img src="images/tipClose.png" alt="" /></div>
        <div class="tipText2 tip_btn" rel="2">
            <img class="mt30 level2_btn" src="images/view_now2.png" alt=""/>
        </div>
    </div>
    <div class="tipLevel_3" style="display:none">
        <img src="images/tipImg3.png" alt="" class="tipImg3" />
        <div class="tip_close"><img src="images/tipClose.png" alt="" /></div>
        <div class="tipText3 tip_btn" rel="3">
            <img class="mt30 level2_btn" src="images/view_now2.png" alt=""/>
        </div>
    </div>
    <div class="tipLevel_4" style="display:none">
        <img src="images/tipImg4.png" alt="" class="tipImg4" />
        <div class="tip_close"><img src="images/tipClose.png" alt="" /></div>
        <div class="tipText4 tip_btn" rel="4">
            <img class="mt30 level2_btn" src="images/view_now2.png" alt=""/>
        </div>
    </div>
    <div class="tipLevel_5" style="display:none">
        <img src="images/tipImg5.png" alt=""/>
        <div class="tip_close"><img src="images/tipClose.png" alt="" /></div>
        <div class="tipText1 tip_btn" rel="5">
            <img class="mt30 level2_btn" src="images/view_now1.png" alt=""/>
        </div>
    </div>
</div>
<script>
    seajs.use(['js/top','js/nav','js/main']);
</script>
</body>

</html>

